.hotel-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr); // 创建两列布局
  gap: 20px; // 卡片之间的间隙
  padding: 20px; // 容器的内边距
}

.hotel-card {
  display: flex;
  flex-direction: column; // 卡片内的内容垂直排列
  border-radius: 8px; // 圆角
  overflow: hidden; // 隐藏溢出的内容
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); // 阴影效果
  background-color: #fff; // 背景颜色
}

.hotel-image {
  width: 100%; // 图片宽度占满卡片宽度
  aspect-ratio: 3 / 2; // 设置宽高比，这里是3:2
  object-fit: cover; // 覆盖填充保持宽高比
}

.hotel-info {
  padding: 10px; // 文本信息的内边距
  display: flex;
  flex-direction: column; // 以列方式排列文本信息
  justify-content: space-between; // 分散对齐
  flex: 1; // 信息部分填充剩余空间
}
.hotel-title-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px; // 与评分的间隔
  
  .hotel-title {
    font-size: 16px;
    font-weight: bold;
  }
  
  .special-tag{
  	font-size: 24rpx;
  	font-weight: bold;
  	border: 1rpx solid #F61856;
  	color: #F61856;
  	background-color: transparent;
  	border-radius: 10rpx;
  	white-space: nowrap; /* 防止文本换行 */
  }
}

.hotel-rating {
  display: flex;
  font-size: 14px;
  color: #00aaff; // 评分的颜色
  margin-bottom: 8px; // 与评论数的间隔
}

.rating-value {
  margin-left: 4px;
  font-weight: bold;
}

.hotel-reviews {
  margin-left: auto; // 将评论数推向右侧
  font-size: 12px;
  color: #999;
  margin-bottom: 8px; // 与价格的间隔
}

.hotel-pricing {
  display: flex;
  align-items: center;
  flex-direction: row;
}

.current-price {
  font-size: 18px;
  color: #f5a623;
  font-weight: bold;
  margin-left: auto; /* 推向右侧 */
}
